import React from "react";
import { NavBar, Icon, List, InputItem, Button } from "antd-mobile";

class Login extends React.Component {
    state = {
        hasError: false,
        value: "",
    };
    onChange = (value) => {};
    render() {
        let { history } = this.props;
        return (
            <div className="login">
                <NavBar
                    mode="dark"
                    icon={<Icon type="left" size="lg" />}
                    onLeftClick={() => history.goBack()}
                >
                    登录
                </NavBar>
                <List renderHeader={() => "请登录"}>
                    <InputItem
                        type="text"
                        placeholder="请输入用户名"
                        error={this.state.hasError}
                        onErrorClick={this.onErrorClick}
                        value={this.state.value}
                    >
                        用户名
                    </InputItem>
                    <InputItem
                        type="password"
                        placeholder="请输入密码"
                        error={this.state.hasError}
                        onErrorClick={this.onErrorClick}
                        value={this.state.value}
                    >
                        密码
                    </InputItem>
                    <div style={{display: 'flex',justifyContent: 'space-evenly',padding: '10px 0'}}>
                        <Button
                            type="primary"
                            size="small"
                            style={{ width: "100px" }}
                        >
                            立即登录
                        </Button>
                        <Button
                            type="warning"
                            size="small"
                            style={{ width: "100px" }}
                            onClick={() => history.push('/reg')}
                        >
                            免费注册
                        </Button>
                    </div>
                </List>
            </div>
        );
    }
}

export default Login;
